<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>创客手机网站</title>
  <script src="/wap/js/flexible.js"></script>
  <script src="/wap/js/jquery-3.2.1.min.js"></script>
  <script src="/wap/js/util.js"></script>
  <link rel="stylesheet" href="/wap/css/style.css">
</head>
<body>
<div id="transfer_account">
  <div id="formInput">
    <div class="input" style="padding: 0;margin: 0 0.4rem">
      <div class="input__left">接收人</div>
      <div class="input__right">
        <input type="tel" id="mobile" placeholder="请输入接收人手机号码" maxlength="11"/>
      </div>
    </div>
    <div class="input" style="padding: 0;margin: 0 0.4rem">
      <div class="input__left">登录密码</div>
      <div class="input__right">
        <input type="password" id="password" placeholder="请输入登录密码" />
      </div>
    </div>
    <p class="c-e60012" style="font-size: 0.37rem;padding: 0.4rem">请仔细核对您输入的手机号是否正确无误，账号转出后，该账号归新手机号所有</p>
    <div class="form__btn" style="margin-top: 0.83rem">确认转出</div>
  </div>
  <div class="shadow" style="display: none;">
    <input type="hidden" name="_token" value="{{csrf_token()}}">
    <div class="popup">
      <div class="title">转出帐号</div>
      <div style="padding: 10px 20px 20px;font-size: 15px;color: #333;text-align: center">
        请仔细核对您输入的手机号是否正确无误，账号转出后，该账号归新手机号所有
      </div>
      <div class="btn-list">
        <div class="btn-item-bor"></div>
        <div class="btn-item" onclick="showPopup()">
          取消
        </div>
        <div class="btn-item c-e60012" onclick="success()">
          确定
        </div>
      </div>
    </div>
  </div>
</div>
</body>
</html>

<script>
    /*$(document).on('click', '.form__btn', function() {
        var isTrue = $('#mobile').val()!='' &&  $('#password').val()!=''?true:false;
        if(!isTrue)
            return

        var mobile = $('#mobile').val();

        if( !/^1[3|4|5|8|7][0-9]\d{4,8}$/.test(mobile) && mobile.length != 11){
            toast('手机号码有误');
            return;
        }
        $('.shadow').toggle();
    })*/
    $(function(){
        $('input').bind('input propertychange', function() {
            var isTrue = $('#mobile').val()!='' &&  $('#password').val()!=''?true:false;
            if(isTrue)
                $('.form__btn').addClass('bg-e60012');
            else
                $('.form__btn').removeClass('bg-e60012');
        });
        $('.form__btn').click(function(){
            var isTrue = $('#mobile').val()!='' &&  $('#password').val()!=''?true:false;
            if(!isTrue)
                return
            var mobile = $('#mobile').val();
            if( !/^1[3|4|5|8|7][0-9]\d{4,8}$/.test(mobile) || mobile.length != 11){
                toast('手机号码有误',2000);
                return;
            }
            $('.shadow').toggle();
        })
    })
    function success(){
        $('.shadow').toggle();
        var id = '{{ $id }}';
        var mobile = $('#mobile').val();
        var password = $('#password').val();
        var csrf_token = $('input[name="_token"]').val();
        $.ajax({
            type: 'post',
            url: '{{ route('wap.index.transferAccount') }}',
            data: {'id':id,'mobile':mobile,'password':password,'_token':csrf_token},
            dataType: "JSON",
            async: false,
            success: function (res) {
                console.log(res);
                if(res.s=='FAIL'){
                    toast(res.data,2000);
                }else{
                    toast('转移成功！',2000);
                    window.location.href = '/wap/index';
                }
            },
            error: function (res) {
                console.log(res, 'error');
            }
        });
    }
    function showPopup(){
        $('.shadow').toggle();
    }
</script>